import 'dart:math';
import 'dart:ui';
import 'package:date_format/date_format.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:s_mankey/config/resource_mananger.dart';
import 'package:s_mankey/config/router_config.dart';
import 'package:s_mankey/model/audio_list_model.dart';
import 'package:s_mankey/model/favorites_model.dart';
import 'package:s_mankey/model/audio_label_model.dart';
import 'package:s_mankey/model/banner_model.dart';
import 'package:s_mankey/provider/provider_widget.dart';
import 'package:s_mankey/ui/widget/home_car_widget.dart';
import 'package:s_mankey/view_model/audio_vmodel.dart';

class AudioList extends StatefulWidget {

  @override
  _AudioList createState() => _AudioList();
}

class _AudioList extends State<AudioList> with SingleTickerProviderStateMixin {

  @override
  void initState() {

    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return ProviderWidget<AudioListVModel>(
        model: AudioListVModel(),onModelReady: (model) => model.initData(),
    builder: (context, model ,child){
    return (model.datas == null)? Text('') :
      DefaultTabController(
      length: model.tabList.length,
      initialIndex: 0,
      child: Builder(
        builder: (context) {
          return Scaffold(
            backgroundColor: AppColor.ScaffoldBackgoundColor,
              appBar: AppBar(
                elevation: 0,
                title: Text('音频历史'),
                actions: [
                  Padding(
                    padding: const EdgeInsets.only(right: 15),
                    child: Center(
                      child: GestureDetector(onTap: (){
                        Navigator.pushNamed(context, RouterName.audioFavorites);
                      },child: Icon(Icons.favorite,color: Colors.red,)),
                    ),
                  ),
                ],
                bottom: TabBar(
                    indicatorColor: Color(0xffff3f7f,),
                    indicatorPadding: EdgeInsets.fromLTRB(10, 0, 10, 0),
                    labelPadding: EdgeInsets.fromLTRB(10,0,10,0),
                    indicatorSize: TabBarIndicatorSize.tab,
                    indicatorWeight: 2,
                    labelStyle: TextStyle(fontSize: AppFontSize.Size16, color: Colors.black),
                    unselectedLabelStyle: TextStyle(fontSize: AppFontSize.Size14, color: Color(0xffbababa)),
                    isScrollable: true,
                    tabs: List.generate(
                        model.tabList.length,
                            (index) {
                          return Tab(
                            text: model.tabList[index].name,
                          );
                        })),
              ),

              body:
              TabBarView(children: List.generate(model.tabList.length, (index) => AudioListWidget(datas: model.datas['data'][index]),)),

            );
        },
      ),
    );
        });
  }
}

/// 列表层视图
class AudioListWidget extends StatelessWidget {
  final datas;
  AudioListWidget({this.datas});

  @override
  Widget build(BuildContext context) {
    List<AudioListModel> _datas = datas.map<AudioListModel>((item) => AudioListModel.fromJson(item)).toList();
    return
      ListView.builder(
        itemCount: 10,
        itemBuilder: (BuildContext context, int index) {
          return GestureDetector(onTap: (){
            Navigator.pushNamed(context, RouterName.audioDetail,arguments: {'vid': _datas[index].vid});
          },child: Container(
            decoration: BoxDecoration(border: Border(bottom: BorderSide(color: AppColor.dividerColor))),
            margin: EdgeInsets.fromLTRB(15, 0, 15, 0),
            padding: EdgeInsets.fromLTRB(0, 10, 0, 10),
            child: Row(children: [
              ClipOval(clipBehavior: Clip.antiAlias,
                child: Image.network(_datas[index].headImg,width: 40,height: 40,fit: BoxFit.cover,),),
              Expanded(child: Padding(
                padding: const EdgeInsets.fromLTRB(8,0,8,0),
                child: Column(children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Expanded(child: Text(_datas[index].courseTitle,style: TextStyle(color: Colors.black,fontSize: AppFontSize.Size16),maxLines: 1,overflow: TextOverflow.ellipsis,),),
                      Text(_datas[index].language,style: TextStyle(color:Color(0xff747474)),),
                      IconFonts.rightIcon,
                      Text(_datas[index].time,style: TextStyle(color:Color(0xff747474),fontSize: AppFontSize.Size14),),
                    ],),

                  Padding(
                    padding: const EdgeInsets.only(top:2),
                    child: Text(_datas[index].profile,
                      style: TextStyle(color: Color(0xff747474),fontSize: AppFontSize.Size14),maxLines: 2,overflow: TextOverflow.ellipsis,),
                  )
                ],),
              ),),

              Icon(Icons.play_circle_filled),
            ],),
          ));
        },
      );
  }
}
